<%--
  Created by IntelliJ IDEA.
  User: ZLY
  Date: 2020/12/1
  Time: 22:38
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="../layui/css/layui.css" />
<%--    <link rel="stylesheet" type="text/css" href="./css/style.css" />--%>
    <script src="../layui/layui.js"></script>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
    <script src="${pageContext.request.contextPath}/layui/layui.js" charset="utf-8"></script>
</head>
<body>
<div id="right">
    <div class="layui-card" style="width: 400px">
        <div class="layui-card-header" style="width: 400px">基本信息</div>
        <div class="layui-card-body" >
            <form class="layui-form" lay-filter="information" id="information" style="margin-top: 5px">
                <div class="layui-input-block layui-layout-right">
                    <button type="submit" <%--onclick="setInformation();"--%> class="layui-btn layui-btn-primary layui-btn-sm"
                            lay-submit
                            lay-filter="xiugai" id="xiugai">
                        <i  class="layui-icon" style="border: 0px" ></i>
                    </button>
                </div>
               <%-- <div class="layui-input-block layui-layout-right">
                    <button  class="layui-btn layui-btn-primary" lay-submit layui-filter="xiugai" id="xiugai" style="float: right;right: 20px ;">
                        <i  class="layui-icon" style="border: 0px" ></i>
                    </button>
                </div>--%>
                <input type="hidden" name="img" id="avatar"   class="layui-input">
                <div class="layui-upload" style="padding-left:100px ; padding-top: 20px">
                    <div class="layui-upload-list">
                        <img class="layui-upload-img" src="${sessionScope.cuser.img}" id="demo1" style="width: 100px;height: 80px">
<%--                        <p id="demoText"></p>--%>
                    </div>
                    <button type="button" class="layui-btn" id="test1">上传图片</button>
                </div>
                <div>
                    <div class="layui-form-item layui-row" style="margin-bottom: 2px">
                        <label class="layui-form-label">编号</label>
                        <div class="layui-input-inline">
                            <input type="text" name="id" id="id" lay-verify="required" class="layui-input" disabled>
                        </div>
                    </div>

                    <div class="layui-form-item layui-row" style="margin-bottom: 2px">
                        <label class="layui-form-label">姓名</label>
                        <div class="layui-input-inline">
                            <input type="text" name="name" id="name" lay-verify="required|name" class="layui-input" >
                        </div>
                    </div>
                    <div class="layui-form-item layui-row" style="margin-bottom: 2px">
                        <label class="layui-form-label">电话</label>
                        <div class="layui-input-inline ">
                            <input type="text" name="iphone" id="iphone" lay-verify="required|iphone" class="layui-input" >
                        </div>
                    </div>

                    <div class="layui-form-item layui-row" style="margin-bottom: 2px">
                        <label class="layui-form-label">密码</label>
                        <div class="layui-input-inline ">
                            <input type="password" name="pwd" id="pwd" lay-verify="required|pwd" class="layui-input" >
                        </div>
                    </div>

                    <div class="layui-form-item layui-row" style="margin-bottom: 2px">
                        <label class="layui-form-label">身份证号</label>
                        <div class="layui-input-inline ">
                            <input type="text" name="idcard" id="idcard" lay-verify="required|idcard" class="layui-input" disabled>
                        </div>
                    </div>
               </div>
            </form>
        </div>
    </div>
</div>



<script>
    //JavaScript代码区域
    layui.use(['table','form',"upload"], function(){
        var upload = layui.upload;
        var table = layui.table;
        var $ = layui.jquery;
        var form = layui.form;
        $(function () {
            getinformation();
        })
        function getinformation(){
            $.ajax({
                url:'${pageContext.request.contextPath}/User/queryAll',
                type:"post",
                dataType:'JSON',
                success:function (d){
                   // alert("dddddd"+JSON.stringify(d));
                  if (d!=null){
                      form.val('information',d);
                        $("#avatar").val(d.img);
                    //  form.var(d);
                   //   alert(d);
                   //   alert("返回成功,有值");
                  }
                    $('#demo1').attr('src',d.img);
                }
            });
        }


        //获取修改后的用户信息(form表单监听,当点击upd按钮时,判断有没有满足条件)
        form.on('submit(xiugai)', function (data) {
         //      alert("11111111111111111");
                // var xinxi=form.val('information');
                // alert(typeof JSON.stringify(xinxi));
                // alert(JSON.stringify(xinxi.img));
                // alert(JSON.stringify(xinxi))
                $.ajax({
                    url:'${pageContext.request.contextPath}/User/update',
                    data: data.field,
                    type: 'post',
                    success:function (d) {
                        layui.alert("修改信息成功！！！");
                        if(d>0){
                            layui.alert("修改信息成功！！！");
                        }
                    },errors:function () {
                        alert("服务器故障！！！！！！111")
                    }
                })
          //  })
            return false;
        });


        /*function xiugaixinxi() {
            $("#xiugai").click(function () {
                var xinxi=form.val('information');
                alert(typeof JSON.stringify(xinxi));
                alert(JSON.stringify(xinxi.img));
                alert(JSON.stringify(xinxi))
                $.ajax({
                    url:'${pageContext.request.contextPath}/User/update',
                    dataType: "JSON",
                    data: xinxi,
                   // data:xinxi,
                    type: 'post',
                    success:function (d) {
                        layui.alert("修改信息成功！！！");
                        if(d>0){
                            layui.alert("修改信息成功！！！");
                        }
                    },errors:function () {
                        alert("服务器故障！！！！！！111")
                    }
                })
            })
        }*/




        /*88888888888888888****-----------添加个人头像的  上传图片--------*/
        var img="";
        var uploadInst = upload.render({
            elem: '#test1' //绑定元素
            ,url: '${pageContext.request.contextPath}/User/upl' //上传接口
            ,done: function(res){
                //   alert("res"+res);
                //    alert("res.data"+res.data);
                //上传完毕回调
                //如果上传失败
                if(res.code == 0){
                    var src=res.data;
                    $("#avatar").val(src);
                    $('#demo1').attr('src',src );// attr(属性名, 属性值)  设置属性的值
                    //     alert(src);
                    img=src;
                    // $('#demo1').attr('src',src );

                }else
                {
                    return layer.msg('上传失败');
                }
            }
            ,error: function(){
                //请求异常回调
                alert("请求异常回调")
            }
        });



        //表单验证
        form.verify({
            required: [
                /[\S]+/, "必填项不能为空"
            ]
            , name: function (value, item) { // value：表单的值、item：表单的DOM对象
                if (!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)) {
                    return '用户名不能有特殊字符';
                }
                if (/^\d+\d+\d$/.test(value)) {
                    return '用户名不能全为数字';
                }
                //如果不想自动弹出默认提示框，可以直接返回 true，这时你可以通过其他任意方式提示（v2.5.7 新增）
                if (value === 'xxx') {
                    return '用户名不能为敏感词';
                }
            }
            , pwd: [
                /^[\S]{6,14}$/
                , '密码必须6到14位，且不能出现空格'
            ]
            , iphone: [
                /(^$)|^1\d{10}$/
                //： /^1[34578]\d{9}$/,'手机号码为：1[3-8]xxxxxxxxx'
                //：或者为：^1([38][0-9]|4[5-9]|5[0-3,5-9]|66|7[0-8]|9[89])[0-9]{8}$
                , '手机号必须为11位'
            ]
            , idcard: [
                /(^$)|(^\d{15}$)|(^\d{17}(x|X|\d)$)/, '请输入正确的身份证号'
            ]
        });






    });

</script>
</body>
</html>


